import React, { FC, useEffect, useState } from "react";
import { Select } from "antd";
import Https2 from "@/utils/Https2";
import debounce from "lodash/debounce";
interface propType {
  value?: string | number;
  onSuccess: (e) => void; //上传成功的回调事件
}
const SelectUser: FC<propType> = (props) => {
  const { value, onSuccess } = props;
  const [data, setData] = useState([]);
  const [loading, setLoading] = useState(false);
  //const [userInfo, setUserInfo] = useState({ value });
  const getUserList = async (value) => {
    setLoading(true);
    let res: any = await Https2.get(
      "/system/user/v2/userList?value=" + value,
      {}
    );
    setLoading(false);
    if (res && res.length > 0) {
      setData(res);
    } else {
      setData([]);
    }
  };
  const handleSearch = debounce(function (value) {
    getUserList(value);
  }, 1000);
  useEffect(() => {
    getUserList("");
  }, []);
  return (
    <Select
      onChange={(e) => {
        let userObj = data.filter(function (o) {
          return o.userId == e;
        })[0];
        console.log(userObj, "-userObj");
        onSuccess(userObj);
      }}
      onSearch={handleSearch}
      loading={loading}
      showSearch={true}
      value={value}
      filterOption={false}
      placeholder="请选择推荐办卡人"
    >
      {data &&
        data.map(
          (e: { userId: string; phonenumber: string; nickName: string }) => (
            <Select.Option key={e.userId} value={e.userId}>
              {e.nickName + "(" + e.phonenumber + ")"}
            </Select.Option>
          )
        )}
    </Select>
  );
};

export default SelectUser;
